<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>回收工作台</title>
    <link rel="icon" href="./favicon.png" />
    <link rel="stylesheet" href="../common/css/reset.css" />
    <link rel="stylesheet" href="../common/css/element-ui.css" />
    <link rel="stylesheet" href="../common/css/common.css" />
    <link rel="stylesheet" href="./css/index.css" />
  </head>
  <body>
    <div id="app" v-cloak>
      <!-- header -->
      <header>
        <div class="logo">
          <a :href="linkList.Home" target="_blank">
            <img src="./images/logo.png" class="img-logo" />
          </a>
          <img src="./images/title.png" class="img-title" />
        </div>
        <div class="header-right">
          <div class="icon-list">
            <a :href="linkList.Home" target="_blank" class="icon-item">
              <img src="./images/icon-h-1.png" class="icon" />
              <span>Feijiu </span>
            </a>
            <a :href="linkList.Shop" target="_blank" class="icon-item">
              <img src="./images/icon-h-2.png" class="icon" />
              <span>我的商铺 </span>
            </a>
            <a :href="linkList.Help" target="_blank" class="icon-item">
              <img src="./images/icon-h-3.png" class="icon" />
              <span>帮助中心 </span>
            </a>
            <div id="workstationItemTel" class="icon-item">
              <img src="./images/icon-h-4.png" class="icon" />
              <span>联系客服 </span>
              <!-- 客服电话 -->
              <div id="workstationTel">
                <div class="tel">
                  <span>400-136-5858</span>
                </div>
              </div>
            </div>
            <a :href="linkList.Message" target="_blank" class="icon-item">
              <img src="./images/icon-h-5.png" class="icon" />
              <span
                >消息
                <template v-if="userInfo.message > 0"
                  >(<b style="color: #ff4448; font-weight: normal"
                    >{{userInfo.message}} </b
                  >)</template
                >
              </span>
            </a>
          </div>
          <div class="user-info" id="workstationUserInfo">
            <img
              :src="userInfo.avatar || './images/default.png'"
              class="img-avatar"
            />
            <div class="user-name">{{userInfo.name || '用户'}}</div>
            <img src="./images/icon-menu.png" class="icon-menu" />
            <div id="workstationUserMenu">
              <div class="user-menu">
                <a
                  :href="linkList.GrowthCenter"
                  target="_blank"
                  class="menu-item"
                >
                  成长中心
                </a>
                <a
                  :href="linkList.PointsMall"
                  target="_blank"
                  class="menu-item"
                >
                  积分商城
                </a>
                <a
                  :href="linkList.ChangePassword"
                  target="_blank"
                  class="menu-item"
                >
                  修改密码
                </a>
                <a
                  :href="linkList.PhoneBinding"
                  target="_blank"
                  class="menu-item"
                >
                  手机绑定
                </a>
                <a
                  :href="linkList.AccountCancellation"
                  target="_blank"
                  class="menu-item"
                >
                  账号注销
                </a>
                <a
                  :href="linkList.Logout"
                  target="_blank"
                  class="menu-item menu-item-exit"
                >
                  退出登录
                </a>
              </div>
            </div>
          </div>
        </div>
      </header>
      <!-- nav -->
      <div class="nav">
        <div class="nav-list">
          <div class="nav-item active">
            <p class="text">工作台</p>
          </div>
          <a
            v-for="item in navList"
            :key="item.id"
            :href="item.link"
            :target="item.target"
            class="nav-item"
          >
            <p class="text">{{item.title}}</p>
          </a>
        </div>
      </div>
      <!-- main -->
      <section class="page-container">
        <!-- 公告 -->
        <div class="panel notice">
          <img src="./images/icon-weather.png" class="icon-weather" />
          <img src="./images/gonggao.png" class="img-gonggao" />
          <el-carousel direction="vertical" :autoplay="true" interval="10000">
            <el-carousel-item v-for="item in notice" :key="item.id">
              <a :href="item.link" target="_blank" class="text">
                {{item.title}}
              </a>
            </el-carousel-item>
          </el-carousel>
        </div>
        <!-- 分栏 -->
        <div class="page-content">
          <!-- 左侧 -->
          <div class="left">
            <!-- 1 商机管理 -->
            <div class="panel business">
              <div class="title-line">
                <h3 class="panel-title">商机管理</h3>
                <a :href="linkList.MoreBusinessManagement" target="_blank">
                  <div class="more-box">
                    <span class="text">查看更多</span>
                    <img src="./images/icon-right.png" class="icon-right" />
                  </div>
                </a>
              </div>
              <div class="panel-list">
                <div
                  v-for="(item, index) in businessManagement"
                  :key="item.id"
                  class="panel-item"
                >
                  <template v-if="item.title === '推荐生意'">
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="请前往App查看"
                      placement="bottom"
                    >
                      <div class="item-title">
                        <img
                          :src="`./images/icon1-${index + 1}.png`"
                          class="icon1"
                        />
                        <span>{{item.title}}</span>
                      </div>
                    </el-tooltip>
                    <div class="item-content">
                      <el-tooltip
                        v-for="(subItem, index) in item.list"
                        :key="subItem.id"
                        class="item"
                        effect="dark"
                        content="请前往App查看"
                        placement="bottom"
                      >
                        <div class="line">
                          <span class="text-label">{{subItem.title}}</span>
                          <span class="text-num">{{subItem.num}}</span>
                        </div>
                      </el-tooltip>
                    </div>
                  </template>
                  <template v-else>
                    <a :href="item.link" target="_blank" class="item-title">
                      <img
                        :src="`./images/icon1-${index + 1}.png`"
                        class="icon1"
                      />
                      <span>{{item.title}}</span>
                    </a>
                    <div class="item-content">
                      <a
                        v-for="(subItem, index) in item.list"
                        :key="subItem.id"
                        :href="subItem.link"
                        target="_blank"
                        class="line"
                      >
                        <span class="text-label">{{subItem.title}}</span>
                        <span class="text-num">{{subItem.num}}</span>
                      </a>
                    </div>
                  </template>
                </div>
              </div>
            </div>
            <!-- 2 增值提效 -->
            <div class="panel value">
              <div class="title-line">
                <h3 class="panel-title">增值提效</h3>
                <a :href="linkList.MoreValueImprovement" target="_blank">
                  <div class="more-box">
                    <span class="text">查看更多</span>
                    <img src="./images/icon-right.png" class="icon-right" />
                  </div>
                </a>
              </div>
              <div class="panel-line">
                <a
                  :href="item.link"
                  target="_blank"
                  class="panel-item"
                  v-for="item in valueImprovement.top "
                  :key="item.id"
                >
                  <img :src="`./images/icon2-${item.icon}.png`" class="icon2" />
                  <div class="text-box">
                    <div class="text-line">
                      <span class="text-1"> {{item.title}} </span>
                      <div class="text-2">同行在用</div>
                    </div>
                    <div class="text-3">{{item.desc}}</div>
                  </div>
                  <div class="item-right">立即使用</div>
                </a>
              </div>
              <div class="panel-list">
                <a
                  :href="item.link"
                  target="_blank"
                  class="panel-item"
                  v-for="item in valueImprovement.all "
                  :key="item.id"
                >
                  <img :src="`./images/icon2-${item.icon}.png`" class="icon2" />
                  <span>{{item.title}}</span>
                </a>
              </div>
              <div
                class="panel-sub-title"
                v-if="valueImprovement.use.length > 0"
              >
                正在使用
              </div>
              <div class="panel-list current-use">
                <a
                  :href="item.link"
                  target="_blank"
                  class="panel-item"
                  v-for="item in valueImprovement.use"
                  :key="item.id"
                >
                  <img :src="`./images/icon2-${item.icon}.png`" class="icon2" />
                  <span>{{item.title}}</span>
                </a>
              </div>
            </div>
            <!-- 3 我的商铺 -->
            <div class="panel shop">
              <div class="title-line">
                <h3 class="panel-title">
                  我的商铺<span class="title-desc">
                    新机会，新流量，提前布局商铺运营，提升成交
                  </span>
                </h3>
              </div>
              <div class="panel-content">
                <div class="content-left">
                  <div class="panel-line line1">
                    <div class="text-box">
                      <div class="text-1">商铺评分</div>
                      <div class="text-2">{{myShop.score}}</div>
                    </div>
                    <img src="./images/icon3-1.png" class="icon3-1" />
                  </div>
                  <div class="panel-line line2">
                    <div class="line-item">
                      <div class="text-1">行业排名</div>
                      <div class="text-2">{{myShop.rank}}</div>
                      <template v-if="myShop.rankChange > 0">
                        <img src="./images/icon3-5.png" class="icon3-2" />
                        <div class="text-3 red">
                          {{Math.abs(myShop.rankChange || 0)}}
                        </div>
                      </template>
                      <template v-else-if="myShop.rankChange < 0">
                        <img src="./images/icon3-2.png" class="icon3-2" />
                        <div class="text-3">
                          {{Math.abs(myShop.rankChange || 0)}}
                        </div>
                      </template>
                    </div>
                    <div class="line-item">
                      <div class="text-1">商铺评分</div>
                      <div class="text-2">{{myShop.score}}</div>
                      <template v-if="myShop.score > 90">
                        <img src="./images/icon3-5.png" class="icon3-2" />
                        <div class="text-3 red">高于同行</div>
                      </template>
                      <template v-else>
                        <img src="./images/icon3-2.png" class="icon3-2" />
                        <div class="text-3">低于同行</div>
                      </template>
                    </div>
                  </div>
                  <div class="panel-line line3">
                    <a
                      :href="linkList.ImproveShop"
                      target="_blank"
                      class="line-item"
                    >
                      <div class="text-1">商铺</div>
                      <div class="text-2">立即优化</div>
                    </a>
                    <a
                      :href="linkList.ImproveShop"
                      target="_blank"
                      class="line-item"
                    >
                      <div class="text-1">排名</div>
                      <div class="text-2">立即优化</div>
                    </a>
                    <a
                      :href="linkList.ImproveShop"
                      target="_blank"
                      class="line-item"
                    >
                      <div class="text-1">广告</div>
                      <div class="text-2">立即优化</div>
                    </a>
                  </div>
                </div>
                <div class="content-right">
                  <div class="panel-line line1 space-between">
                    <div class="line-left">
                      <div class="text-num">{{myShop.improveNum}}</div>
                      <div class="text-1">
                        诊断<span class="red">{{myShop.improveNum}}项</span
                        >急需优化，获得海量曝光
                      </div>
                    </div>
                    <a :href="linkList.MoreMyShop" target="_blank">
                      <div class="more-box">
                        <span class="text">更多优化</span>
                        <img src="./images/icon-right.png" class="icon-right" />
                      </div>
                    </a>
                  </div>
                  <div class="box">
                    <img src="./images/icon3-4.png" class="icon3-4" />
                    <div class="text-1">提升流量</div>
                    <div class="text-2">分析商铺数据，提升商铺流量和成交</div>
                    <div class="panel-line space-between">
                      <div class="text-3">
                        搜索优化+广告投放+数据看板，全面帮助您分析商铺数据
                      </div>
                      <a
                        :href="linkList.LearnPractical"
                        target="_blank"
                        class="text-4"
                        >学习实操</a
                      >
                    </div>
                  </div>
                  <div class="line-list">
                    <div
                      class="line-item"
                      v-for="(item, index) in myShop.improveContent "
                      :key="item.id"
                    >
                      <div class="index">{{index + 1}}</div>
                      <a :href="item.link" target="_blank" class="text"
                        >{{item.title}}</a
                      >
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!-- 4 推荐列表 -->
            <div class="panel recommend">
              <div class="tab-list">
                <div
                  class="tab"
                  :class="{active: tabActiveRecommend === 0}"
                  @click="onTabChangeRecommend(0)"
                >
                  资产处置推荐
                </div>
                <div
                  class="tab"
                  :class="{active: tabActiveRecommend === 1}"
                  @click="onTabChangeRecommend(1)"
                >
                  招标拍卖推荐
                </div>
              </div>
              <div
                class="tab-panel"
                :class="{active: tabActiveRecommend === 0}"
              >
                <div class="list">
                  <a
                    :href="item.link"
                    target="_blank"
                    v-for="item in recommend"
                    :key="item.id"
                    class="item"
                  >
                    {{item.title}}
                  </a>
                  <a :href="linkList.MoreAssets" target="_blank">
                    <div class="more-box">
                      查看更多资产处置推荐
                      <i class="el-icon-arrow-right"></i>
                    </div>
                  </a>
                </div>
              </div>
              <div
                class="tab-panel"
                :class="{active: tabActiveRecommend === 1}"
              >
                <div class="list">
                  <a
                    :href="item.link"
                    target="_blank"
                    v-for="item in recommend"
                    :key="item.id"
                    class="item"
                  >
                    {{item.title}}
                  </a>
                  <a :href="linkList.MoreAuction" target="_blank">
                    <div class="more-box">
                      查看更多招标拍卖推荐
                      <i class="el-icon-arrow-right"></i>
                    </div>
                  </a>
                </div>
              </div>
            </div>
          </div>
          <!-- 右侧 -->
          <div class="right">
            <!-- 1 用户信息 -->
            <div class="panel user">
              <div class="box-1">
                <div class="avatar-box">
                  <img
                    :src="userInfo.avatar || './images/default.png'"
                    class="img-avatar"
                  />
                  <a class="user-edit" :href="linkList.UserEdit" target="_blank"
                    >编辑</a
                  >
                </div>

                <div class="text-box">
                  <p class="text-1">{{userInfo.name || '用户'}}</p>
                  <p class="text-3">{{userInfo.phone || '-'}}</p>
                  <a :href="linkList.PointsMall" target="_blank" class="text-2"
                    >当前积分：{{userInfo.point || 0}}</a
                  >
                </div>
              </div>
              <div class="line-1">
                <div class="text-company">{{userInfo.company}}</div>
                <div v-if="userInfo.vip" class="user-vip">
                  {{userInfo.vip}}年
                </div>
              </div>
              <div class="line-date">
                会员到期时间：{{userInfo.expiration}} 【<a
                  :href="linkList.ToRenew"
                  target="_blank"
                  class="line-date-link"
                >
                  我要续费 </a
                >】
              </div>
              <div class="line-2">
                <div
                  v-for="item in userInfo.auth"
                  :key="item.id"
                  class="line-item"
                >
                  <div class="text">{{item.title}}</div>
                  <img src="./images/user-2.png" class="img-user-2" />
                </div>
              </div>
              <div class="box-2" v-if="userInfo.auth_tip">
                <img src="./images/user-3.png" class="img-user-3" />
                <div class="text">
                  进行认证，推广效果提升，促成生意订单量
                  <a
                    :href="linkList.Authentication"
                    target="_blank"
                    class="text-link"
                    >立即认证</a
                  >
                </div>
              </div>
              <div
                class="box-3"
                v-if="userInfo.inquiry && userInfo.inquiry.length > 0"
              >
                <div class="title-line">
                  <div class="panel-sub-title">最新询盘</div>
                  <a :href="linkList.MoreInquiry" target="_blank">
                    <div class="more-box">
                      <span class="num">{{userInfo.inquiry_num}}</span>
                      <span class="text">查看更多</span>
                      <img src="./images/icon-right.png" class="icon-right" />
                    </div>
                  </a>
                </div>
                <div class="panel-list">
                  <a
                    :href="item.link"
                    target="_blank"
                    v-for="item in userInfo.inquiry"
                    :key="item.id"
                    class="panel-item"
                  >
                    {{item.title}}
                  </a>
                </div>
              </div>
            </div>
            <!-- 2 发布商机 -->
            <a
              :href="linkList.PublishBusiness"
              target="_blank"
              class="panel publish"
            >
              <img src="./images/icon-link.png" class="icon-link" />
              <div class="text">发布商机</div>
            </a>
            <!-- 3 成交速递 -->
            <div class="panel speed">
              <div class="title-line">
                <h3 class="panel-title">成交速递</h3>
              </div>
              <el-carousel
                height="124px"
                :autoplay="true"
                interval="20000"
                arrow="never"
                indicator-position="none"
              >
                <el-carousel-item v-for="(list, index) in speed" :key="index">
                  <div class="panel-list">
                    <a
                      v-for="item in list"
                      :key="item.id"
                      :href="item.link"
                      target="_blank"
                      class="panel-item"
                    >
                      【{{item.company}}】做成<span class="red"
                        >{{item.value}}生意</span
                      >
                    </a>
                  </div>
                </el-carousel-item>
              </el-carousel>
            </div>
            <!-- 4 行业排名 -->
            <div class="panel rank">
              <div class="title-line">
                <h3 class="panel-title">行业排名</h3>
                <a :href="linkList.MoreRank" target="_blank">
                  <div class="more-box">
                    <span class="text">查看更多</span>
                    <img src="./images/icon-right.png" class="icon-right" />
                  </div>
                </a>
              </div>
              <div class="table">
                <div class="tr">
                  <div class="th">排名</div>
                  <div class="th">商铺</div>
                  <div class="th">商铺分数</div>
                </div>
                <div v-for="(item, index) in rank" :key="item.id" class="tr">
                  <div class="td">
                    <img
                      v-if="index < 3"
                      :src="`./images/icon-rank-${index + 1}.png`"
                      class="icon-rank"
                    />
                    <div v-else class="index">{{index + 1}}</div>
                  </div>
                  <div class="td">
                    <a :href="item.link" target="_blank"> {{item.title}} </a>
                  </div>
                  <div class="td">{{item.score}}</div>
                </div>
              </div>
            </div>
            <!-- 5 行情报价 -->
            <div class="panel quotation">
              <div class="title-line">
                <h3 class="panel-title">行情报价</h3>
                <a :href="linkList.MoreQuotation" target="_blank">
                  <div class="more-box">
                    <span class="text">查看更多</span>
                    <img src="./images/icon-right.png" class="icon-right" />
                  </div>
                </a>
              </div>
              <div class="tab-list">
                <div
                  v-for="(item, index) in quotationTabs"
                  :key="item"
                  class="tab"
                  :class="{active:tabActiveQuotation=== index}"
                  @click="onTabChangeQuotation(index)"
                >
                  {{item}}
                </div>
              </div>
              <div class="tab-panel active">
                <div class="table">
                  <div class="item" v-for="item in quotation" :key="item.id">
                    <div class="line text-title">{{item.title}}</div>
                    <div class="tr">
                      <div class="td">{{item.value}}</div>
                      <div class="td">
                        <img
                          v-if="item.change > 0"
                          src="./images/icon-up.png"
                          class="icon"
                        />
                        <img
                          v-else-if="item.change < 0"
                          src="./images/icon-down.png"
                          class="icon"
                        />
                        <span class="no-change" v-else>-</span>
                      </div>
                      <div class="td">{{item.date}}</div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </div>
    <script src="../common/js/vue.min.js"></script>
    <script src="../common/js/element-ui.js"></script>
    <script src="./js/config.js"></script>
    <script src="./js/ajax.js"></script>
    <script src="./js/index.js"></script>
  </body>
</html>
